$def with (user_data, audiences, tutored_audiences, tutored_users, checked_users, show_audiences)

$#
$# This file is part of INGInious. See the LICENSE and the COPYRIGHTS files for
$# more information about the licensing of this file.
$#

$if show_audiences:
    <input type="hidden" name="filter_type" id="filter_type" value="audiences"/>
$else:
    <input type="hidden" name="filter_type" id="filter_type" value="users"/>

<div class="card mb-3" id="panel-download-user-audience">
    <div class="card-header">
        <ul class="nav nav-tabs card-header-tabs" role="tablist">
            <li role="presentation" class="nav-item">
                <a
                $if not show_audiences:
                    class="nav-link active"
                $else:
                    class="nav-link"
                 href="#user_filter" aria-controls="user_filter" role="tab" data-toggle="tab">$:_("Select students")</a>
            </li>
            <li role="presentation" class="nav-item">
                <a
                $if show_audiences:
                    class="nav-link active"
                $else:
                    class="nav-link"
                href="#audience_filter" aria-controls="audience_filter" role="tab" data-toggle="tab">$:_('Select audiences')</a>
            </li>

            <li class="nav-item">
                <button type="button" class="ml-3 btn btn-primary btn-xs" onclick="download_page_select(true, this)">$:_("Select all")</button>
            </li>
            <li class="nav-item">
                <button type="button" class="btn btn-primary btn-xs" onclick="download_page_select(false, this)">$:_("Deselect all")</button>
            </li>
            $if len(tutored_users) != 0 or len(tutored_audiences) != 0:
                <li class="nav-item">
                    <button type="button" class="btn btn-primary btn-xs" onclick="download_page_select_tutor(this,
                            ['$'\',\''.join(tutored_users)'],
                            ['$'\',\''.join(tutored_audiences)'])">Tutored only</button>
                </li>
        </ul>
    </div>

    <div class="tab-content">
        <div role="tabpanel" class="tab-pane
            $if not show_audiences:
                active
        " id="user_filter">
            $if len(user_data) == 0:
                <div class="alert alert-warning">$:_("No user to display")</div>
            $else:
                <ul class="list-group list-group-flush checked-list-box">
                    $for userid, username in user_data.items():
                    <li class="list-group-item" data-value="$userid" data-name="users"
                        $if userid in checked_users:
                            data-checked="true"
                    >$username</li>
                </ul>
        </div>
        <div role="tabpanel" class="tab-pane
            $if show_audiences:
                active
        " id="audience_filter">
            $if len(audiences) == 0:
                <div class="alert alert-warning">$:_('No audience to display')</div>
            $else:
                <ul class="list-group list-group-flush checked-list-box">
                    $for audience in audiences:
                        <li class="list-group-item" data-value="$audience['_id']" data-name="audiences" data-checked="$('true' if audience['checked'] else 'false')">
                        $audience['description']
                        </li>
                </ul>
        </div>
    </div>
</div>
<script type="text/javascript">
    $$(function(){
        $$('#panel-download-user-audience').find('a[data-toggle="tab"]').on('shown.bs.tab', function(e)
        {
            if($$(e.target).attr('href') == "#audience_filter") $$('#filter_type').val('audiences');
            else $$('#filter_type').val('users');
        });
    });
</script>